<template>
    <el-container style="background-color:aliceblue;">
      <el-header style="height: 100%;padding: 0;background-color: aliceblue;">
          <div style="background-color: cornflowerblue;height: 40px;">
            <el-col :span="8"><div class="index-title" style="line-height: 40px;color: white;">
              <router-link style="margin-right: 30px;color: white" :to="'/index'">数字后勤服务大厅</router-link>
              <a>运架中心</a>
              <a>服务监督</a>
            </div></el-col>
            <el-col :span="8"  style="line-height: 40px;color: white;"><div class="index-title"><a>膳食中心</a></div></el-col>
            <el-col :span="8">
              <div style="line-height: 40px;color: white;">
               <router-link style="margin-right: 30px;text-decoration: none;color: white;" :to="'/PersonalCenter'">{{user.accountName}}</router-link>
              </div>
              <div style="line-height: 40px;color: white;">
               <a href="javascript:void(0)" @click="logout()" style="position: absolute;top: 0px;margin-left: 300px;text-decoration: none;color: white;">退出登录</a>
              </div>
            </el-col>
          </div>

            <el-col :span="18"><div style="margin-top: 20px;"><img src="../../static/img/logo-repair.png"/></div></el-col>
            <el-col :span="6">
              <div class="index-repair-home" @click="jumpTo('/index')">
                <div class="index-menu-box">
                  <!-- style="display: none; -->
                  <div class="index-box-text">
                    首页<br />
                    <span>Home</span>
                  </div>
                  <div class="index-menu-logo">
                    <img src="../../static/img/icon-home.png"/>
                  </div>
                </div>
              </div>

              <div class="index-repair-notice">
                  <div class="index-menu-box">
                    <div class="index-box-text">
                      通知<br />
                      <span>notice</span>
                    </div>
                  <div class="index-menu-logo">
                    <img src="../../static/img/icon-notice.png"/>
                  </div>
                </div>
              </div>

              <div class="index-repair-service" @click="jumpTo('/serviceGuide')">
                <div class="index-menu-box">
                  <div class="index-box-text">
                    服务帮助<br />
                    <span>help</span>
                  </div>
                  <div class="index-menu-logo">
                    <img src="../../static/img/icon-notice.png"/>
                  </div>
                </div>
              </div>
              </div>
              </el-col>
      </el-header>
      <el-main>
        <div class="notice-list" v-for="n,index in notice">
          <div style="margin-top: 40px;">
            <div class="col-md-10" style="width: 1065px;height: 70px;">
              <p class="ft18"><router-link :to="{path:'notice_detail', query: {type:n.noticetitle }}">{{n.noticetitle}}</router-link></p>
            </div>
            <div class="col-md-2 ft16 ft-grey9 date text-center" style=" margin-bottom: -40px;margin-left:65%;">
              {{n.startdate}}
            </div>
            <div style="width: 830px;margin-top: -10px;">
              <p>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{n.showcontent}}</p>
            </div>

          </div>
        </div>
        <el-pagination
          background
          layout="prev, pager, next"
          :page-count="num"
          @current-change="change">
        </el-pagination>
      </el-main>
    </el-container>
</template>

<script>
  export default {
    name: "Notice",
    data() {
      return {
        notice: [],
        PageForm:{
          page:''
        },
        role:{
          isStudent: JSON.parse(localStorage.getItem("user")).data.state == 2 ? true : false,
          isManager: JSON.parse(localStorage.getItem("user")).data.state == 0 ? true : false,
          isRepairer: JSON.parse(localStorage.getItem("user")).data.state == 1 ? true : false
        },
        num:'',
        user:JSON.parse(localStorage.getItem("user")).data,
      }
    },
    methods: {
      router(){
         this.$router.push({path:`/notice_detail?titel=${n.noticetitle}`})

      },
      logout(){
      	this.$http.get("/logout")
        localStorage.removeItem("user")
        location.reload()
      },
      jumpTo(route){
        this.$router.push(route)
      },
      change(val){
        console.log(val)
        this.PageForm.page=val
        this.$http.post("/repairNotice2/getTiltel",this.PageForm).then(resp => {
          console.log(resp)
          this.notice = resp.data.data.n;
          this.num=resp.data.data.page
          console.log(this.num)
          console.log(this.notice)
        })
        }
    },
    created() {
      this.PageForm.page='1'
      this.$http.post("/repairNotice2/getTiltel",this.PageForm).then(resp => {
        console.log(resp)
        this.notice = resp.data.data.n;
        this.num=resp.data.data.page
        console.log(this.num)
        console.log(this.notice)
      })
    }
  }
</script>

<style>
</style>
